Skip to content

类(Es6 推荐)

面向对象编程(OOP)是一种编程范式,三个主要概念:类与实例、继承、封装、多态。

类和构造函数

使用 class 关键字声明一个类。

js
// 父类
class Shape {
  // 构造函数
  constructor(color) {
    this.color = color;
  }

  // 方法
  getArea() {
    return 0;
  }

  // 封装:color属性为私有属性,通过getColor()方法访问
  getColor() {
    return this.color;
  }
}

// 子类继承父类
class Circle extends Shape {
  // 构造函数
  constructor(color, radius) {
    super(color);
    this.radius = radius;
  }

  // 重写父类方法
  getArea() {
    return Math.PI * this.radius ** 2;
  }
}

class Rectangle extends Shape {
  // 构造函数
  constructor(color, width, height) {
    super(color);
    this.width = width;
    this.height = height;
  }

  // 重写父类方法
  getArea() {
    return this.width * this.height;
  }
}

// 多态
function printArea(shape) {
  console.log(`The area of the shape is ${shape.getArea()}`);
}

// 创建实例
const circle = new Circle("red", 5);
const rectangle = new Rectangle("blue", 4, 6);

// 调用多态函数
printArea(circle); // 输出: The area of the shape is 78.53981633974483
printArea(rectangle); // 输出: The area of the shape is 24

class Person {
  name;

  constructor(name) {
    this.name = name;
  }

  introduceSelf() {
    console.log(`Hi! I'm ${this.name}`);
  }
}

继承

js
// 我们使用 extends 关键字来声明这个类继承自另一个类。
class Professor extends Person {
  teaches; // 添加了一个新的属性 teaches

  constructor(name, teaches) {
    super(name);
    this.teaches = teaches;
  }

  // 覆盖了父类的 introduceSelf() 方法
  introduceSelf() {
    console.log(
      `My name is ${this.name}, and I will be your ${this.teaches} professor.`
    );
  }

  // 添加了一个新的方法 grade()
  grade(paper) {
    const grade = Math.floor(Math.random() * (5 - 1) + 1);
    console.log(grade);
  }
}

封装

js
class Student extends Person {
  // 私有的属性,只能内部使用
  #year;

  constructor(name, year) {
    super(name);
    this.#year = year;
  }

  // 私有的方法
  #somePrivateMethod() {
    console.log("You called me?");
  }

  introduceSelf() {
    console.log(`Hi! I'm ${this.name}, and I'm in year ${this.#year}.`);
  }

  canStudyArchery() {
    return this.#year > 1;
  }
}